<%--
    @author Kusal Samarakoon

--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<SCRIPT language="javascript">

    function addChildRow(tableID) {
        var table = document.getElementById(tableID);
        var rowCount = table.rows.length;
        var count = parseInt(rowCount) / 2;
        var row1 = table.insertRow(rowCount);
        var row2 = table.insertRow(rowCount + 1);

        var str1 = "<td>" + $('#child-name').val() + "</td><td colspan='3'>" + '<s:textarea style="width:500px;" id="name' + rowCount + '" name="children[' + count + '].fullName"/>' + "</td><td rowspan='2'>" + "<!--<input type='checkbox'>-->" + "</td>"
        var str2 = "<td>" + $('#child-dob').val() + "</td><td>" + '<s:textfield  cssClass="childDOB" style="width:100px;" id="dateOfBirth' + rowCount + '" name="children[' + count + '].dateOfBirth"/>' +
                "</td><td>" + $('#is-disable').val() + "</td><td>" +
                ""
                + "</td>";
        row1.innerHTML = str1;
        row2.innerHTML = str2;
        setDatePicker();

    }
    $(document).ready(function () {
        setDatePicker();

    });
    function setDatePicker() {
        var dO = new Date();
        var d = dO.getDate();
        var m = dO.getMonth();
        var y = dO.getFullYear();
        var today = y + "/" + m + "/" + d;
        var id;
        $('.childDOB').DatePicker({
            format:'y/m/d',
            date:dO,
            current:dO,
            position:'right',
            onBeforeShow:function () {
                id = "#" + this.id;
                $('.childDOB').DatePickerSetDate(dO, true);
            },
            onChange:function (formated, dates) {

                $(id).val(formated);

            }
        });
    }

    function deleteRow(tableID) {
        try {
            var table = document.getElementById(tableID);
            var rowCount = table.rows.length;

            for (var i = 0; i < rowCount; i++) {
                var row = table.rows[i];
                var chkbox = row.cells[4].childNodes[0];
                if (null != chkbox && true == chkbox.checked) {
                    table.deleteRow(i);
                    rowCount--;
                    i--;
                }
            }
        } catch (e) {
            alert(e);
        }
    }

    function disablePersonalInformation() {
        var fields = new Array(
                'name',
                'dateOfBirth',
                'designation',
                'address',
                'nic',
                'mobile',
                'landPhone',
                'email',
                'fax',
                'spouse',
                'successor'
                );
        enableFields(fields);
    }

    $(function () {
        if ($('#approvalState').val() == 'PENDING') {
            disablePersonalInformation();
        }
    });
</SCRIPT>
<tr>
    <td><s:label value="%{getText('name_of_holder.label')}"/></td>
    <td colspan="3"><s:property value="alienation.holder.name"/></td>
</tr>
<tr>
    <td><s:label value="%{getText('date_of_birth.label')}"/></td>
    <td><s:property value="alienation.holder.dateOfBirth"/></td>
    <td><s:label value="%{getText('gender.label')}"/></td>
    <td><s:property value="genderName"/></td>
</tr>
<tr>
    <td><s:label value="%{getText('occupation.label')}"/></td>
    <td colspan="3"><s:property value="alienation.holder.designation"/></td>
</tr>
<tr>
    <td><s:label value="%{getText('address.label')}"/></td>
    <td colspan="3"><s:property value="alienation.holder.contacts.address"/></td>
</tr>
<tr>
    <td><s:label value="%{getText('nic.label')}"/></td>
    <td colspan="3"><s:property value="alienation.holder.registrationNumberOrNIC"/></td>
</tr>
<tr>
    <td><s:label value="%{getText('contact_number.label')}"/></td>
    <td><s:label value="%{getText('mobile.label')}"/></td>
    <td><s:property value="alienation.holder.contacts.mobile"/></td>
</tr>
<tr>
    <td></td>
    <td><s:label value="%{getText('land_line.label')}"/></td>
    <td><s:property value="alienation.holder.contacts.landPhone"/></td>
</tr>
<tr>
    <td><s:label value="%{getText('email.label')}"/></td>
    <td colspan="3"><s:property value="alienation.holder.contacts.email"/></td>
</tr>
<tr>
    <td><s:label value="%{getText('fax.label')}"/></td>
    <td colspan="3"><s:property value="alienation.holder.contacts.fax"/></td>
</tr>
<tr>
    <td><s:label value="%{getText('name_of_spouse.label')}"/></td>
    <td colspan="3"><s:label name="alienation.holder.spouse" cssClass="width-500-px"/></td>
</tr>

<tr>
    <td><s:label value="%{getText('children.label')}"/></td>
    <td colspan="3">
        <table id="childrenTable">
            <s:iterator status="status" value="alienation.holder.children">
                <tr>
                    <td><s:label value="%{getText('name.label')}"/></td>
                    <td colspan="3">
                        <s:label value="%{fullName}" cssClass="width-500-px"
                                 name="%{'alienation.holder.children[' +( #status.count-1)+'].fullName'}"/>

                    </td>
                </tr>
                <tr>
                    <td><s:label value="%{getText('date_of_birth.label')}"/></td>
                    <td>
                        <s:label value="%{dateOfBirth}"
                                 name="%{'alienation.holder.children[' +( #status.count-1)+'].dateOfBirth'}"
                                 cssClass="childDOB"/>

                    </td>
                    <td><s:label value="%{getText('gender.label')}"/></td>
                    <td>
                        <s:label name="alienation.holder.children.gender" cssClass="width-200-px"/>
                    </td>
                </tr>
                <%--<s:hidden name="%{'alienation.holder.children[' +( #status.count-1)+'].id'}"
                          id="%{'childId' + ( #status.count-1)}"/>--%>
            </s:iterator>
        </table>
    </td>
</tr>


<tr>
    <td><s:label value="%{getText('nominated_successor.label')}"/></td>
    <td colspan="3"><s:label id="successor" name="alienation.successor" cssClass="width-500-px"/></td>
</tr>

<s:hidden id="child-name" value="%{getText('name.label')}"/>
<s:hidden id="child-dob" value="%{getText('dob.label')}"/>